<template>
	<cl-crud ref="crud" @load="onLoad">
		<cl-pagefull>
			<template #head>
				<el-row type="flex">
					<cl-filter-group v-model="search">
						<cl-filter label="汇总日期范围：">
							<cl-date-picker
								v-model="search.timeList"
								type="daterange"
								range-separator="至"
								start-placeholder="开始日期"
								end-placeholder="结束日期"
								value-format="yyyy-MM-dd"
								:clearable="false"
								style="width: 210px"
							/>
						</cl-filter>
					</cl-filter-group>
				</el-row>
			</template>

			<!-- 数据表格 -->
			<el-row>
				<cl-table v-bind="tableProp"> </cl-table>
			</el-row>
		</cl-pagefull>
	</cl-crud>
</template>

<script>
import dayjs from "dayjs";
export default {
	data() {
		return {
			tableProp: {
				"context-menu": ["refresh"],
				columns: [
					{
						label: "门店",
						prop: "dept_name",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "业绩",
						prop: "real_amount",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "当月返款业绩",
						prop: "to_month_debt",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "往月返款业绩",
						prop: "pass_debt",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "未返款业绩",
						prop: "no_close_achieve",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					},
					{
						label: "未返款金额",
						prop: "no_close_amount",
						minWidth: 100,
						align: "left",
						showOverflowTooltip: true
					}
				],
				props: {
					showSummary: true,
				
				}
			},
			search: {
				timeList: [dayjs().format("YYYY-MM-DD"), dayjs().format("YYYY-MM-DD")]
			}
		};
	},
	created() {},
	mounted() {},
	methods: {
		onLoad({ ctx, app }) {
			ctx.service(this.$service.reconciliation)
				.set("dict", {
					api: {
						page: "deptReportTotal"
					}
				})
				.done();
			app.refresh(this.search);
		},
		edit(row) {
			this.$refs.editDialogRef.open(this.$TOOL.objCopy(row));
		}
	}
};
</script>
<style scoped lang="scss"></style>
